/* components */
import { SettingGPTViewTable } from '@src/modules/setting/gpt/components'
/* enum */
import ComponentNameEnum from '@model/enum/ComponentNameEnum'
/* model */
import { 
  SettingGPTManageTypeCNNmaeEnum,
  SettingGPTManageTypeEnum,
  SettingGPTQuestionTypeCNNmaeEnum, 
  SettingGPTQuestionTypeEnum 
} from '@src/modules/setting/gpt/model'
/* vue */
import { defineComponent, PropType } from 'vue'

enum SettingGPTManageViewTabsEventEnum {
  Input = 'input'
}

export default defineComponent({
  name: ComponentNameEnum.SettingGPTManageViewTabs,
  props: {
    value: {
      type: String as PropType<SettingGPTManageTypeEnum>,
      default: SettingGPTManageTypeEnum.Standard
    },
    onInput: {
      type: Function
    }
  },
  data() {
    return {
      currentTab: this.value
    }
  },
  methods: {
    onTabChangeHandler(tab: SettingGPTQuestionTypeEnum) {
      this.$emit(SettingGPTManageViewTabsEventEnum.Input, tab)
    }
  },
  render() {
    return (
      <div class={ComponentNameEnum.SettingGPTManageViewTabs}>
        
        <el-tabs
          value={this.value}
          onInput={this.onTabChangeHandler}
        >
          
          {/* start 标准问题库 */}
          <el-tab-pane 
            label={SettingGPTManageTypeCNNmaeEnum[SettingGPTManageTypeEnum.Standard]}
            name={SettingGPTManageTypeEnum.Standard}
          >
          </el-tab-pane>
          {/* end 标准问题库 */}
          
          {/* start 问题列表 */}
          <el-tab-pane 
            label={SettingGPTManageTypeCNNmaeEnum[SettingGPTManageTypeEnum.QuestionList]}
            name={SettingGPTManageTypeEnum.QuestionList}
          >
          </el-tab-pane>
          {/* end 问题列表 */}
          
        </el-tabs>
        
      </div>
    )
  }
})